import Taro, {Component} from '@tarojs/taro'
import { AtInput, AtForm,AtTextarea ,AtButton } from 'taro-ui'
import {getGlobalData, setGlobalData} from "../../../../global.d";
import {toast} from "../../../../utils";

import {View} from "@tarojs/components"
import './index.scss'
const db = Taro.cloud.database();
export default class Index extends Component {
    constructor(props) {
        super(props);
        this.state = {
            current: 0,
            user:{},
            name:'',
            time:'',
            phone:'',
            reason:''
        }
    }
  componentDidMount () {
    Taro.setNavigationBarTitle({
      title: '新建假条'
    })

    const user = getGlobalData('user')

    this.setState({
      user,
      name:user.userDetail.userRealName
    })
  }
  handleChange(key, val) {
    this.setState({
      [key] : val
    });
    return val
  }
  handleChange2(key, val) {
    this.setState({
      [key] : val.detail.value
    });
  }
  cheackInput(){
    const {name,time,reason,phone} = this.state
    if(time===''||time.length<3){
      toast('请详细填写时间')
      return false
    }
    if(reason===''||reason.length<20){
      toast('请详细填写请假原因')
      return false
    }
    if(phone===''||phone.length<10){
      toast('请详细填写手机号码')
      return false
    }
    return true
  }
  submitBreak(){
      if(!this.cheackInput)
        return
      db.collection("break")
        .add({
          data:{
            name:this.state.name,
            userId:this.state.user._id,
            time:this.state.time,
            phone:this.state.phone,
            reason:this.state.reason,
            addTime:new Date(),
            status:'未批准',
            classKey:this.state.user.userLastTimeClass.classKey
          }
        })
        .then(res=>{
          Taro.navigateBack()
        })
  }

    render() {
      const {name,time,reason,phone} = this.state
        return (
            <View >

              <AtForm>
                <AtInput
                  name='name'
                  title='姓名'
                  type='text'
                  value={name}
                  disabled
                  onChange={this.handleChange.bind(this,'name')}
                />
                <AtInput
                  name='time'
                  title='请假时间'
                  type='text'
                  placeholder='如：本周一下午第1节课'
                  value={time}
                  onChange={this.handleChange.bind(this,'time')}
                />

                <AtInput
                  name='phone'
                  border={false}
                  title='手机号码'
                  type='phone'
                  placeholder='手机号码'
                  value={phone}
                  onChange={this.handleChange.bind(this,'phone')}
                />
                <AtTextarea
                  value={reason}
                  onChange={this.handleChange2.bind(this,'reason')}
                  maxLength={300}
                  placeholder='请假原因...'
                />
              </AtForm>

              <AtButton
              type='primary'
              onClick={this.submitBreak.bind(this)}
              className='bottom'
              >
                提交假条
              </AtButton>


            </View>
        )
    }

}
